import React from "react";
import { Link } from "react-router-dom";
import { Outlet, useLocation } from "react-router";
import { Kanban } from "pages/kanban";
import { Epic } from "pages/epic";
import { Menu } from "antd";

const useRouteType = () => {
  const units = useLocation().pathname.split("/");
  return units[units.length - 1];
};

export const Project = () => {
  const routeType = useRouteType();
  return (
    <div>
      <Menu mode={"inline"} selectedKeys={[routeType]}>
        <Menu.Item key={"kanban"}>
          <Link to={"kanban"}>看板</Link>
        </Menu.Item>
        <Menu.Item key={"epic"}>
          <Link to={"epic"}>任务组</Link>
        </Menu.Item>
      </Menu>
      <Outlet></Outlet>
    </div>
  );
};
